<!--
Copyright 2014 The Chromium Authors. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file.
-->

<link rel="import" href="../model/ct-builder-list.html">
<link rel="import" href="ct-button.html">
<link rel="import" href="../bower_components/paper-dialog/paper-action-dialog.html">
<link rel="import" href="../bower_components/paper-dialog/paper-dialog-transition.html">
<link rel="import" href="../bower_components/paper-input/paper-input.html">
<link rel="import" href="../bower_components/pushstate-anchor/pushstate-anchor.html">

<polymer-element name="ct-failure-card-buttons" attributes="group bug">
  <template>
    <style>
      :host {
        display: flex;
      }
      :host > * {
        margin-right: 5px;
      }
      ct-button {
        white-space: nowrap;
      }

      #bugReminder {
        font-size: large;
        color: red;
      }

      #examineLink {
        padding: 6px 22px;
      }
    </style>
    <a is="pushstate-anchor" href="{{ group.examineUrl }}" id="examineLink">Examine</a>
    <template if="{{ !group.isSnoozed }}">
      <ct-button id="snooze" on-tap="{{ snooze }}" label="Snooze"></ct-button>
    </template>
    <template if="{{ group.isSnoozed }}">
      <ct-button id="snooze" on-tap="{{ unsnooze }}" label="Unsnooze"></ct-button>
    </template>
    <ct-button id="link-bug" on-tap="{{ linkBug }}" label="Link Bug"></ct-button>

    <paper-action-dialog heading="Enter bug number" transition="paper-transition-center" id="bugDialog">
      <paper-input label="Bug# or URL" floatingLabel autofocus id="bug"></paper-input>
      <div><a id="fileBugLink" target="_blank" on-click="{{ fileBugClicked }}">
        <template if="{{ !_fileBugClicked }}">
          File bug
        </template>
      </a></div>
      <template if="{{ _fileBugClicked }}">
        <div id="bugReminder">
          Remember to enter the new bug number above!
        </div>
      </template>
      <ct-button on-tap="{{ removeBug }}" dismissive role="button" id="dialogRemoveBug" label="Remove bug link"></ct-button>
      <ct-button on-tap="{{ saveBug }}" affirmative role="button" id="dialogOk" label="OK"></ct-button>
    </paper-action-dialog>
  </template>
  <script>
    Polymer({
      group: null,
      _fileBugClicked: false,

      snooze: function() {
        this.group.snoozeUntil(Date.now() + 60 * 60 * 1000);
        ga('send', 'event', 'snooze', 'click');
      },

      unsnooze: function() {
        this.group.unsnooze();
        ga('send', 'event', 'unsnooze', 'click');
      },

      linkBug: function() {
        this.$.bug.value = this.group.bug;
        this._fileBugClicked = false;
        this.$.fileBugLink.href = this.group.data.fileBugLink();
        this.$.bugDialog.toggle();
        ga('send', 'event', 'linkBug', 'click');
      },

      saveBug: function() {
        this.group.setBug(this.$.bug.value);
        this.$.bugDialog.toggle();
        ga('send', 'event', 'saveBug', 'click');
      },

      removeBug: function() {
        this.group.clearBug();
        this.$.bugDialog.toggle();
        ga('send', 'event', 'removeBug', 'click');
      },

      fileBugClicked: function() {
        this._fileBugClicked = true;
        ga('send', 'event', 'fileBug', 'click');
      },
    });
  </script>
</polymer-element>
